import * as React from 'react';

import * as Global from '../TS/Global';
import * as Loading from './Loading';
import { MessageBox } from './messagebox';

export interface ShViewProps extends Global.Myprops {
    ttxx?: string
};

interface ShViewState {
    cmd: string
    resultstr: string
};

export class ShView extends React.Component<ShViewProps,
    ShViewState> {
    constructor(props) {
        super(props);
        //设置状态
        this.state = {
            cmd: "",
            resultstr: ""
            // secondsElapsed: 0
        };

    }
    GetWeb(cmdstr: any): void {
        console.log("执行命令");
        let promise = new Promise(function (resolve, reject) {

            $.ajax({
                url: "WebService.cgi",

                type: 'post',
                error: (xhr, status, error) => {

                    reject(error);
                },
                contentType: "application/x-www-form-urlencoded",
                data: {
                    datafrom: "common",
                    jsondata: JSON.stringify({
                        cmd: 'RunCMD',
                        str: cmdstr
                    })


                },
                dataType: "json",

                // dataType: "jsonp", jsonp: "callback", jsonpCallback: "success_jsonpCallback",
                success: (result) => {
                    resolve(result);
                }
            });
        });
        promise.then((results: any) => {
            console.log("获取数据成功");
            let control: any = this.refs.loading;
            control.ReciveMsgEvent(this, "close", "");
            //this.forceUpdate();
            this.setState({ resultstr: results["result"] });
            console.log(results)
        }).catch((errors) => {

            let control: any = this.refs.loading;
            control.ReciveMsgEvent(this, "close", "");
            console.log("获取数据失败");
            let control_msg: any = this.refs.messagebox;
            control_msg.ShowError(Global.GetLocal("执行命令出错") + errors);
        });
    }
    //用于处理收到的数据
    ReciveMsgEvent(source: any, cmd: string, obj?: any, ...args) {
        if (cmd == 'update') {
            this.forceUpdate();
        } else { }
    }

    //下一步进行显示 进行初始化
    componentDidMount() {
        //类似window.onload
        this.setState((prv, prop) => ({
            // count: this.state.count + 1
        }));
    }
    componentWillReceiveProps(nextProps) {
        //每次父控件重新绘制,赋值新的props触发
        this.setState({});
    }
    public handleClick(e: React.MouseEvent<any>): void {
        let control: any = this.refs.loading;
        control.ReciveMsgEvent(this, "show", "");
        this.setState({ resultstr: "" });
        this.GetWeb(this.state.cmd);
    }
    public handleChange(event: any): void {
        let tcfg: any = this.state;
        tcfg[event.target.name] = event.target.value;
        this.setState(tcfg);
        //console.log(event.target.value);
    }
    public handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {
        if (event.keyCode == 13) {
            this.handleClick(null);
        }
    }
    public render(): JSX.Element {
        return (
            <div className="col-xs-12 col-sm-10" >
                <div className="panel panel-default">
                    <div className="panel-heading">
                        <h3 className="panel-title">
                            {Global.GetLocal("SH命令")}</h3>
                    </div>
                    <div className="panel-body">
                        <div className="input-group">
                            <input
                                ref="cmd"
                                type="text"
                                name="cmd"
                                onChange={e => this.handleChange(e)}
                                onKeyDown={e => this.handleKeyDown(e)}
                                className="form-control"
                                placeholder={Global.GetLocal("输入命令")} />
                            <span className="input-group-btn">
                                <button
                                    className="btn btn-default"
                                    type="button"
                                    onClick={e => this.handleClick(e)}>Go!</button>
                            </span>
                        </div>
                        <br />

                        <span >{Global.GetLocal("运行结果")}
                        </span>

                        <textarea
                            name="cmdresult"
                            id="cmdresult"
                            className="form-control"
                            spellCheck={false}
                            rows={20}
                            required={false}
                            value={this.state.resultstr}></textarea>

                    </div>
                    <MessageBox
                        ref="messagebox"
                        MessageType='alert'
                        Title={Global.GetLocal("提醒")}
                        Content={Global.GetLocal("保存配置成功")} />
                    <Loading.Loading ref="loading" ShowText="加载中..." IsShow={false} />
                </div>
            </div>
        );
    }
}